<template>
  <div class="es-jumbotron">
    <div class="row">
      <div class="col-md-6">
        <h1>Home</h1>
        <p>Brief Description of Page Content.</p>
        <div class="es-divider es-divider-horizontal es-divider-default"></div>
        <p>
          Detailed Description of Page Content, Detailed Description of Page
          Content, Detailed Description of Page Content.
        </p>
      </div>
      <div class="col-md-6"></div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Jumbotron",
};
</script>

<style lang="scss">
.es-jumbotron {
  background-color: var(--purple);
  background-image: url(https://booking.webestica.com/assets/images/bg/02.jpg);
  background-position: center center;
  background-size: cover;
  color: var(--white);
  height: 26.25rem;
}
</style>
